{% extends 'commons/base_user.html' %}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    {% block top_title %}
        <title>美多商城-用户中心</title>
    {% endblock top_title %}
    {% block top_static %}
        <link rel="stylesheet" type="text/css" href="{{ static('css/reset.css') }}">
        <link rel="stylesheet" type="text/css" href="{{ static('css/main.css') }}">
        <script type="text/javascript" src="{{ static('js/vue-2.5.16.js') }}"></script>
        <script type="text/javascript" src="{{ static('js/axios-0.18.0.min.js') }}"></script>
    {% endblock top_static %}
</head>
<body>
<div id="app">
    {% block body_content %}
        <div class="main_con clearfix">
            <div class="left_menu_con clearfix">
                <h3>用户中心</h3>
                <ul>
                    <li><a href="{{ url('users:info') }}">· 个人信息</a></li>
                    <li><a href="{{ url('users:addresses') }}">· 收货地址</a></li>
                    <li><a href="{{ url('orders:info',args=(1,)) }}">· 全部订单</a></li>

                    <li><a href="{{ url('users:changepassword') }}" class="active">· 修改密码</a></li>
                </ul>
            </div>
            <div class="right_content clearfix" v-cloak>
                <div class="info_con clearfix">
                    <h3 class="common_title2">修改密码</h3>
                    <div class="site_con pass_change_con">
                        <form class="change_pwd" method="post" @submit="on_submit" v-cloak>
                            {{ csrf_input }}
                            <div class="form_group">
                                <label>当前密码：</label>
                                <input type="password" v-model="old_password" @blur="check_old_password"
                                       name="old_password">
                                <span v-show="error_old_password" class="old_pwd_error">密码最少8位，最长20位</span>
                                {% if origin_password_errmsg %}
                                    <span class="old_pwd_error">{{ origin_password_errmsg }}</span>
                                {% endif %}
                            </div>
                            <div class="form_group">
                                <label>新密码：</label>
                                <input type="password" v-model="new_password" @blur="check_new_password"
                                       name="new_password">
                                <span v-show="error_new_password"
                                      class="new_pwd_error">[[ error_new_password_message ]]</span>
                            </div>
                            <div class="form_group">
                                <label>确认新密码：</label>
                                <input type="password" v-model="new_password2" @blur="check_new_password2"
                                       name="new_password2">
                                <span v-show="error_new_password2" class="new_cpwd_error">两次输入的密码不一致</span>
                                {% if change_password_errmsg %}
                                    <span class="new_cpwd_error">{{ change_password_errmsg }}</span>
                                {% endif %}
                            </div>
                            <input type="submit" name="" value="确 定" class="info_submit">
                            <input type="reset" name="" value="取 消" class="info_submit info_reset">
                        </form>
                    </div>
                </div>
            </div>
        </div>

    {% endblock body_content %}
</div>
{% block bottom_script %}
    <script type="text/javascript" src="{{ static('js/common.js') }}"></script>
    <script type="text/javascript" src="{{ static('js/user_center_pass.js') }}"></script>
{% endblock bottom_script %}
</body>
</html>